<template>
  <div>
    <table cellpadding="10">
      <thead>
        <th>学科</th>
        <th>分数</th>
      </thead>
      <tr v-for="(item, index) in stu" :key="index">
        <td>{{ item.subject }}</td>
        <td>
          <input type="text" v-model.number="item.grade">
        </td>
      </tr>
      <tr>
        <td>总分</td>
        <td>{{ sum }}</td>
      </tr>
      <tr>
        <td>平均分</td>
        <td>{{ avg }}</td>
      </tr>
    </table>
  </div>
</template>
<script>
export default {
  data() {
    return {
      stu: [
        {
          subject: "语文",
          grade: 120,
        },
        {
          subject: "数学",
          grade: 50,
        },
        {
          subject: "英语",
          grade: 120,
        }
      ]
    }
  },
  methods: {

  },
  computed: {
    sum() {
      return this.stu.reduce((total, item) => total + item.grade, 0);
    },
    avg() {
      // toFixed(2)取二位小数
      return this.stu.reduce((total, item) => total + item.grade, 0) / this.stu.length
    }
  }
}


</script>